import 'dart:io';

import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart';
import 'package:flutter_picker_plus/picker.dart';
import 'package:get/get.dart';
import 'package:wechat_assets_picker/wechat_assets_picker.dart';

class FormPage extends StatefulWidget {
  const FormPage({super.key});

  @override
  State<FormPage> createState() => _FormPageState();
}

class _FormPageState extends State<FormPage> {
  bool isCheck = false;
  int maxCount = 6;
  List<String> images = [];

  showPicker(BuildContext context) async {
    Picker picker = Picker(
        adapter: PickerDataAdapter<String>(
            pickerData: ["文章", "图片", "视频"]),
        changeToFirst: false,
        textAlign: TextAlign.left,
        textStyle: TextStyle(
            color: Theme.of(context).brightness == Brightness.dark
                ? Colors.yellow
                : Colors.blue,
           ),
        selectedTextStyle: TextStyle(color: Colors.red),
        columnPadding: const EdgeInsets.all(8.0),
        onConfirm: (Picker picker, List value) {
          print(value.toString());
          print(picker.getSelectedValues());
        });
    picker.showBottomSheet(context);
  }

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        title: Text("表单"),
        centerTitle: true,
        leading: IconButton(
          onPressed: () => {Get.back()},
          icon: Icon(Icons.chevron_left),
        ),
      ),
      body: SingleChildScrollView(
        child: Container(
          padding: EdgeInsets.only(top: 20, bottom: 20),
          decoration: BoxDecoration(color: Colors.grey.shade200),
          child: Column(
              spacing: 10,
              children: [
          Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("标题"),
              Divider(),
              SizedBox(
                height: 40,
                child: TextField(
                  decoration: const InputDecoration(
                    hintText: "请输入标题",
                    hintStyle: TextStyle(color: Colors.grey),
                    contentPadding: EdgeInsets.zero,
                    border: OutlineInputBorder(
                      borderSide: BorderSide.none,
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide.none, // 边框颜色
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("子标题"),
              Divider(),
              SizedBox(
                height: 40,
                child: TextField(
                  decoration: const InputDecoration(
                    hintText: "请输入子标题",
                    hintStyle: TextStyle(color: Colors.grey),
                    contentPadding: EdgeInsets.zero,
                    border: OutlineInputBorder(
                      borderSide: BorderSide.none,
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide.none, // 边框颜色
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("分类"),
              Divider(),
              SizedBox(
                height: 40,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text("请选择分类", style: TextStyle(color: Colors.grey)),
                    Builder(builder: (context){
                      return IconButton(
                        onPressed: () {
                          showPicker(context);
                        },
                        icon: Icon(Icons.chevron_right, color: Colors.grey),
                      );
                    })
                  ],
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("附件"),
              Divider(),
              GestureDetector(
                onTap: () async {
                  FilePickerResult? result = await FilePicker.platform
                      .pickFiles(allowMultiple: false);
                },
                child: Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.all(Radius.circular(4)),
                    color: Colors.grey.shade200,
                  ),
                  height: 100,
                  width: 100,
                  child: Icon(Icons.attach_file, color: Colors.grey),
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("图片"),
              Divider(),
              Wrap(
                spacing: 10,
                runSpacing: 10,
                children: List.generate(
                    images.length == maxCount ? images.length : images.length +
                        1, (index) {
                  return index < images.length
                      ? Stack(
                    children: [
                      Container(
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(
                            Radius.circular(4),
                          ),
                          //color: Colors.grey.shade200,
                        ),
                        height: 100,
                        width: 100,
                        child: Image.file(
                          File(images[index]),
                          fit: BoxFit.cover,
                        ),
                      ),
                      Positioned(
                        top: -16,
                        right: -16,
                        child: IconButton(
                          onPressed:
                              () =>
                          {
                            setState(() {
                              images.removeAt(index);
                            }),
                          },
                          icon: Icon(
                            Icons.close,
                            color: Colors.redAccent,
                          ),
                        ),
                      ),
                    ],
                  )
                      : GestureDetector(
                    onTap: () async {
                      List<AssetEntity>? files =
                      await AssetPicker.pickAssets(
                        context,
                        pickerConfig: AssetPickerConfig(
                          maxAssets: maxCount - images.length,
                          requestType: RequestType.image,
                          textDelegate:
                          const AssetPickerTextDelegate(),
                          specialPickerType:
                          SpecialPickerType.noPreview,
                        ),
                      );
                      if (files != null && files.isNotEmpty) {
                        for (AssetEntity asset in files) {
                          File? file = await asset.file;
                          setState(() {
                            images.add(file!.path);
                          });
                        }
                      }
                    },
                    child: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.all(
                          Radius.circular(4),
                        ),
                        color: Colors.grey.shade200,
                      ),
                      height: 100,
                      width: 100,
                      child: Icon(
                        Icons.camera_alt_outlined,
                        color: Colors.grey,
                      ),
                    ),
                  );
                }),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("是否接收通知"),
              Divider(),
              SizedBox(
                height: 40,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      "请选择是否接受通知",
                      style: TextStyle(color: Colors.grey),
                    ),
                    Switch(
                      value: isCheck,
                      onChanged:
                          (val) =>
                      {
                        setState(() {
                          isCheck = val;
                        }),
                      },
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("是否提醒"),
              Divider(),
              SizedBox(
                height: 40,
                child: Row(
                  children: [
                    Row(
                      children: [
                        Text("短信"),
                        Checkbox(value: true, onChanged: (val) {}),
                      ],
                    ),
                    Row(
                      children: [
                        Text("邮件"),
                        Checkbox(value: true, onChanged: (val) {}),
                      ],
                    ),
                    Row(
                      children: [
                        Text("通知"),
                        Checkbox(value: true, onChanged: (val) {}),
                      ],
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.fromLTRB(12, 10, 12, 10),
          decoration: BoxDecoration(color: Colors.white),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("备注"),
              Divider(),
              SizedBox(
                height: 200,
                child: TextField(
                  maxLines: 10,
                  decoration: const InputDecoration(
                    hintText: "请输入备注",
                    hintStyle: TextStyle(color: Colors.grey),
                    contentPadding: EdgeInsets.zero,
                    border: OutlineInputBorder(
                      borderSide: BorderSide.none,
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide.none, // 边框颜色
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
        SizedBox(
          width: double.infinity,
          height: 70,
          child: Container(
            padding: EdgeInsets.all(10),
            child: ElevatedButton(style: ButtonStyle(
              backgroundColor: WidgetStateProperty.all(Theme.of(context).colorScheme.primary),
                shape: WidgetStateProperty.all(RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(8)))),
                onPressed: () {},
                child: Text("提交", style: TextStyle(color: Colors.white),)),
            ),
          )
          ],
        ),
      ),
    ),);
  }
}
